import { createRouter, createWebHistory } from "vue-router";
// import UserList from "../page/小测试/路由小测试/列表.vue";
import UserDetail from "../page/小测试/路由小测试/详情.vue";
import UserWrapper from "../page/小测试/路由小测试/包裹.vue";
import CssBox from "../page/css/盒模型.vue";
import Flex1 from "../page/flex/index.vue";
// import Flex2 from "../page/flex/布局1.vue";
const Flex2 = () => import("../page/flex/布局1.vue");
const UserList = () => import("../page/小测试/路由小测试/列表.vue");
const AntdVImport = () => import("../page/antdV/按需引入.vue");
const AntdVLayout = () => import("../page/antdV/antdLayout.vue");
const LayoutTest = () => import("../page/小测试/layout测试.vue");
const AntdVMenu = () => import("../page/antdV/antdMenu.vue");
const SlotIndex = () => import("../page/vSlot/index.vue");
const AntdVTable = () => import("../page/antdV/antdTable.vue");
const AntdVTableData = () => import("../page/antdV/antdTableData.vue");
const AntdVTableAsyncData = () =>
  import("../page/antdV/antdTableAsyncData.vue");
const AntdVForm = () => import("../page/antdV/antdForm.vue");
const AntdVFormValidate = () => import("../page/antdV/antdFormValidate.vue");
const Combination = () => import("../page/组合/index.vue");
const routerInstance = createRouter({
  history: createWebHistory(),
  routes: [
    { path: "/combination", component: Combination },
    { path: "/antdVFormValidate", component: AntdVFormValidate },
    { path: "/antdVForm", component: AntdVForm },
    { path: "/antdVTableAsyncData", component: AntdVTableAsyncData },
    { path: "/antdVTableData", component: AntdVTableData },
    { path: "/antdVTable", component: AntdVTable },
    { path: "/slotIndex", component: SlotIndex },
    { path: "/antdVMenu", name: "key1", component: AntdVMenu },
    { path: "/layoutTest", name: "key2", component: LayoutTest },
    { path: "/antdVLayout", component: AntdVLayout },
    { path: "/antdVImport", component: AntdVImport },
    { path: "/flex1", component: Flex1 },
    { path: "/flex2", component: Flex2 },
    { path: "/list", component: UserList },
    { path: "/detail", component: UserDetail },
    {
      path: "/user",
      component: UserWrapper,
      children: [
        { path: "list", name: "userList", component: UserList },
        { path: "detail", name: "userDetail", component: UserDetail },
      ],
    },
    { path: "/css-box", component: CssBox },
  ],
});

export default routerInstance;
